﻿@{
    Layout = null;
    var task = ViewData["task"] as Pay.DTO.task_dto;
}
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>关注微信公众号</title>
    <meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0,maximum-scale=1.0, user-scalable=no" />
    <link rel="stylesheet" href="~/Content/css/base.css" />
    <link rel="stylesheet" href="~/Content/css/tuoken.css" />
    <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
    <script type="text/javascript" src="~/Content/js/base.js"></script>
    <script src="~/Content/js/layer/1.9.3/layer.js"></script>
</head>
<body>
    <div class="header">
        <a href="javascript:history.go(-1);">
            <span class="back"></span>
        </a>
        <div class="hdtitle">
            关注微信公众号
        </div>
    </div>
    <div class="aboutwhite">
        <div class="refuelcard webchart_warp">
            <div class="refulcard_explain">
                <div class="impower">
                    <p>按照如下步骤完成微信公众号关注</p>
                    <p>即可领取@(task.soup_value)个马力值奖励</p>
                </div>
                <ul>
                    <li><em>1</em><div class="msg">在微信公众号中搜索“拓垦”并关注</div></li>
                    <li><em>2</em><div class="msg">在拓垦公众号中输入“领取马力”获得验证码</div></li>
                    <li><em>3</em><div class="msg">在下方输入验证码，验证成功后即可领取马力</div></li>
                </ul>
            </div>
            <p class="refulcard_explainfo">说明：每一个拓垦账号只能领取一次！</p>
        </div>
        @if (!task.is_complete)
        {
            <div class="impower_yzm">
                <p class="hint"> 请输入6位验证码</p>
                <input type="text" class="yzm" id="yzm" placeholder="验证码">
                <input type="button" class="impower_yzmbtn" id="impower_yzmbtn" style="height:0.8rem;width:77%" value="确认提交(+@(task.soup_value)马力)" disabled="disabled">
            </div>
        }
        else
        {
            <div class="impower_pd">
                <div class="impower_task">
                    <p class="succeed"> <i></i> 恭喜你已经完成该任务</p>
                </div>
                <a href="#" class="impower_btn on" style="height:0.8rem;width:77%">您已经获得过马力值了</a>
            </div>
        }
    </div>
    <script type="text/javascript">
        $(".yzm").keyup(function () {
            var yzm = $("#yzm").val();
            if (yzm != "") {
                $("#impower_yzmbtn").attr("disabled", false);
                $('#impower_yzmbtn').addClass('on');
            } else {
                $("#impower_yzmbtn").attr("disabled", true);
                $('#impower_yzmbtn').removeClass('on');
            }
        });
        $("#impower_yzmbtn").click(function () {
            $.ajax({
                url: '@Url.Action("TaskCode", "FollowPubAccount")',
                async: false,
                type: 'POST',
                data: { code: $("#yzm").val()},
                success: function (result) {
                    if (result.result_code == 1000) {
                        layer.msg("领取成功");
                    } else {
                        layer.msg(result.result_msg);
                    }
                }
            });

        })
    </script>
</body>
</html>